<template>
  <div class="box">
    <el-footer style="height:auto">
        <div class="statement">
            <div>
                <h3 >关于我们</h3>
                <a href="http://wpa.qq.com/msgrd?v=3&uin=746381864&site=qq&menu=yes">
                    <p>加入我们</p>
                </a>
                <a href="http://wpa.qq.com/msgrd?v=3&uin=746381864&site=qq&menu=yes">
                    <p>关于我们</p>
                </a>
                <a href="http://wpa.qq.com/msgrd?v=3&uin=746381864&site=qq&menu=yes">
                    <p>联系我们</p>
                </a>
            </div>
             <div>
                <h3 >意见/友链/投诉/合作</h3>
                <router-link to="/suggest">
                    <p>投件入口</p>
                </router-link>
                
            </div>
            <div>
                 <h3>未来规划</h3>
                <!-- <router-link to="f"> -->
                    <p>入住小程序</p>
                <!-- </router-link> -->
              
            </div>
            <div>
                 <h3 >友情链接</h3>
                <a v-for="item in links" :key="item.index" target="_blank" :href="item.linkHref">
                    <p ><span style="color:rgba(255,255,255,.5)" v-if="item.linkText!=null">{{item.linkText}}</span>
                         <img style="margin-top:10px" width="100px" height="30px" v-else :src="item.linkImg"  />
                        
                    </p>
                  
                </a>
                
            </div>
        </div>

        <div class="fore">
            <p style="text-align:center">本网用于收集大量图片以及文案，如果侵犯了您的版权，请立刻联系我们。联系邮箱：746381864@qq.com</p>
          <p class="mess" style="text-align:center">
                <a href="/statement#c">用户条约</a>|
                <a href="/statement#c">注册条约</a>|
                <a href="/statement#b">免责声明</a>|
                <a href="/statement#c">隐私条约</a>

          </p>
           <p class="mess" style="text-align:center">
               <a target="_blank" href="https://beian.miit.gov.cn"><img  width="30px" height="30px" src="@/assets/20200519175915_QSjEv.png">粤ICP备:2020076566</a>|
               <!-- <img width="30px"  height="30px" src="@/assets/20200519180347_yHwtX.png"> 网安备案号：123456789 | -->
                  Copyright © 2022-2025 waghost.com 版权所有 </p>
        </div>
        <p style="text-align:center;line-height:0px"> <img src="@/assets/Logo.png" width="60px"/>
            
        </p>
    </el-footer>
  </div>
</template>

<script>
export default {
    data(){
        return{
            links:[
                {
                    linkId:null,
                    linkImg:null,
                    linkHref:null,
                    linkText:null
                }
            ]
        }
    },
    created(){
        this.$http.get("/getlinks").then(va=>{
                this.links=va.data.data
        })
    }
}
</script>

<style scoped lang="less">
    .box{
        margin-top:300px;
        z-index: 300;
        position: relative;
        width: 100%;
        height: auto;
        background: rgb(116, 114, 116);
        display: block;
        p{
            color: rgb(177, 175, 175);
            font-size: 15px;
        }
        a{
            color: rgb(177, 175, 175);
            font-size: 15px;
        }
    }
    .statement{
        width:70%;
        margin: 10px auto;
        height: auto;
        display: flex;
        div{
            margin: 40px auto;
            width: 30%;
            height: 100%;
            
            p{
                text-align: center;
                line-height: 30px;
                color: #fff;
            }
            h3{
                text-align: center;
                color:rgb(255, 205, 53) ;
            }
        }
    }
    .fore{
    }
    .mess{
        a{
          margin-right: 10px;
            line-height: 40px;
        }
    }
    @media  screen and (max-width: 1300px) {
        .box{
            p{
                font-size: 15px !important;
                // line-height: 30px !important;
            };
        }
        .statement{
            padding-top: 5px;
            display: block !important;
            width: 100% !important;
            div{
                width: 100%;
                display: flex;
                h3{
                    margin-right: 10px;
                    display: inline-block;
                }
                p{
                    margin-right: 10px;

                }
            }
        }
    }
</style>